<template>
	<view style="padding-bottom: 120rpx;">
		<u-cell-group title="申请任务信息">
			<u-cell-item  title="任务标题"  :arrow="false" :value="info.title"></u-cell-item>
			<u-cell-item  title="购物平台"  :value="info.pingtaiStr" :arrow="false"></u-cell-item>
			<u-cell-item  title="店铺ID"  :value="info.shopid" :arrow="false"></u-cell-item>
			<u-cell-item  title="截止日期"  :value="info.jiezhiTime" :arrow="false"></u-cell-item>
			<u-cell-item  title="所需单数"  :value="info.danshuStr" :arrow="false"></u-cell-item>
			<u-cell-item  title="是否有礼品"  :value="info.linpin" :arrow="false"></u-cell-item>
		</u-cell-group>
		<u-cell-group title="买家信息">
			<view class="" style="background-color: #FFFFFF; border-top: 2rpx solid rgba(235,235,235,0.5);">
				<view class="oneTui uni-flex" >
					<view class="" style="position: relative;margin-right: 16rpx;">
						<view class="touxiang">
							<image :src="$jiekou.uploadBaseUrl+info.head" mode="" class=""></image>
						</view>
						<!-- <view class="zaixian yuandian "></view> -->
					</view>
					
					<view class="neirong" style="">
						<view class="uni-flex">
							<view class="" style="flex: 1;">
								<text class="user-name">{{info.username}}</text>
								<image v-if="info.attestation==2" src="../../static/image/yirenzheng.png" mode="" class="renzhengtu"></image>
								<view class="" v-if="info.qu!=undefined" style="color: #8799A3;">{{info.sheng}}.{{info.shi}}.{{info.qu}}</view>
							</view>
							<view v-if="info.pingfenStr!='' && info.pingfenStr!=undefined " class="pingding">综合评定:{{info.pingfenStr}}</view> 
							<view v-else class="pingding">综合评定:优</view>
						</view>
						<view class="biaoqians uni-flex">
							<view class="biaoqian">买家ID：{{info.maijia_id}}</view>
							<view class="biaoqian" v-if="info.tuanduiid != undefined && info.tuanduiid != ''">团队ID：{{info.tuanduiid}}</view>
						</view>
					</view>
				</view>
			</view>
		</u-cell-group>
		<u-cell-group title="个性签名">
			<view class="" style="padding: 30rpx;margin-left: 20rpx;">
				{{info.qianming}}
			</view>
		</u-cell-group>
		<u-cell-group title="购物信息">
			<u-cell-item  title="淘宝帐号"  :arrow="false" :value="info.taobao_zhanghao"></u-cell-item>
			<u-cell-item  title="帐号等级"  :value="info.taobaodengjiStr" :arrow="false"></u-cell-item>
			<u-cell-item  title="京东帐号"  :arrow="false" :value="info.jingdong_zhanghao"></u-cell-item>
			<u-cell-item  title="帐号等级"  :value="info.jingdongdengjiStr" :arrow="false"></u-cell-item>
			<u-cell-item  title="拼多多帐号"  :arrow="false" :value="info.pinduoduo_zhanghao"></u-cell-item>
		</u-cell-group>
		<u-cell-group title="收货地址">
			<view class="" style="padding: 30rpx;margin-left: 20rpx;">
				{{info.shouhuo_addr}}
			</view>
		</u-cell-group>
		
		
		<view class="jieshou" v-if="info.task_status==15 || info.task_status==16" style="position: fixed;bottom: 0;width: 100%;z-index: 1000;background-color: #007AFF;">
			<view class="lianxi uni-flex" style="width: 100%;text-align: center;">
				<view class="" @tap="zaixian(info.maijia_id)" style="color: #FFFFFF;font-size: 35rpx;width: 100%;">咨询买家</view>
			</view>
		</view>
		<view class="jieshou" v-else style="position: fixed;bottom: 0;width: 100%;z-index: 1000;">
			<view class="lianxi uni-flex"  @tap="bohuiShow=true" style="text-align: center;">
				
				<view class="" style="width: 100%;">驳回</view>
			</view>
			<view class="renwu" @tap="show=true">
				<view class="">允许接单</view>
			</view>
		</view>
		<u-modal v-model="show" content="请确认是否接受该任务" @confirm="jieshouRenwu()" :show-cancel-button="true"></u-modal>
		<u-modal v-model="bohuiShow" content="请确认是否驳回该任务" @confirm="bohuiRenwu()" :show-cancel-button="true"></u-modal>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import util from '@/common/util.js';
	export default {
		data() {
			return {
				info:{},
				shenheId:null,
				show:false,
				bohuiShow:false,
				isTijiao:true
			}
		},
		onLoad(parame) {
			var that = this;
			this.shenheId = parame.id;
			that.$util.nuiAjax(that.$jiekou.selectJiedanShenheInfo,{shenheId:parame.id},function(res){
				that.info = res;
			});
		},
		methods: {
			jieshouRenwu:function(){
				var that = this;
				if(!that.isTijiao){
					return;
				}
				that.isTijiao = false;
				that.$util.nuiAjax(that.$jiekou.tongguoJiedanShenqing,{shenheId:that.shenheId,uid:that.info.maijia_id,taskId:that.info.task_id},function(res){
					if(res.result=="true"){
						uni.$emit("tonguoJiedan");
						that.isTijiao = true;
						that.$refs.uToast.show({
							title: "通过成功",
							back:true
						});
					}else{
						that.isTijiao = true;
						that.$refs.uToast.show({
							title: res.message
						});
					}
				});	
			},
			zaixian:function(id){
				var that = this;
				var jiedanTime = this.info.myTaskTime+4*24*60*60*1000;
				var now = new Date();
				if(now.getTime()>jiedanTime){
					that.$refs.uToast.show({
						title: "此订单已超过三天，不可以再联系买家",
					});
				}else{
					// return;
					this.$store.commit('createConversationActive', id)
					uni.navigateTo({
						url: '../chat/chat'
					})
				}
				
				
			},
			bohuiRenwu:function(){
				var that = this;
				if(!that.isTijiao){
					return;
				}
				that.isTijiao = false;
				that.$util.nuiAjax(that.$jiekou.bohuiJiedanShenqing,{shenheId:that.shenheId},function(res){
					if(res.result=="true"){
						uni.$emit("tonguoJiedan");
						that.isTijiao = true;
						that.$refs.uToast.show({
							title: "驳回成功",
							back:true
						});
					}else{
						that.isTijiao = true;
						that.$refs.uToast.show({
							title: res.message
						});
					}
				});	
			}
		},
		filters:{
			dateFormat:(date,str)=>{
				if(date!=undefined){
					return util.dateUtils.dateFormat('YYYY年mm月dd日',new Date(date));
				}else{
					return util.dateUtils.dateFormat('YYYY年mm月dd日',date);
				}
			}
		}
	}
</script>

<style lang="scss">
	.jieshou{
		background-color: #FFFFFF;
		height: 112rpx;
		display: flex;
		flex-direction: row;
	}
	.renwu{
		flex:1;
		padding: 16rpx 0;
	}
	.lianxi image{
		width: 40rpx;
		height: 40rpx;
		margin-top: 42rpx;
		margin-left: 60rpx;
		
	}
	.lianxi view{
		height:40rpx;
		font-size:28rpx;
		font-weight:400;
		color:$uni-color-primary;
		line-height:40rpx;
		padding-top: 38rpx;
		padding-left: 20rpx;
	}
	.lianxi{
		flex:1;
	}
	.renwu view{
		// height:40rpx;
		font-size:28rpx;
		font-weight:500;
		color:#FFFFFF;
		line-height:40rpx;
		padding:20rpx 0 20rpx;
		background-color: $uni-color-primary;
		text-align: center;
		margin-right: 30rpx;
		border-radius:4rpx;
	}
	.jieshou{
		background-color: #FFFFFF;
		height: 112rpx;
		display: flex;
		flex-direction: row;
		
	}
	.beizhu{
		height:40rpx;
		font-size:28rpx;
		font-weight:400;
		color:#999999;
		line-height:40rpx;
		padding-top: 10rpx;
	}
	.label-data{
		height:40rpx;
		font-size:28rpx;
		font-weight:400;
		color:rgba(51,51,51,1);
		line-height:40rpx;
	}
	.one-label{
		padding-top: 30rpx;
		justify-content: space-between;
	}
	.labelcolor{
		color: #999999;
		text-align: right;
	}
	.title-text{
		width:112rpx;
		height:40rpx;
		font-size:28rpx;
		font-weight:400;
		line-height:40rpx;
	}
	.content{
		padding: 30rpx;
		margin-top: 20rpx;
		background-color: #FFFFFF;
	}
	
	page{
		background-color: $page-bg-color;
		height: 100%;
	}
	.oneTui .zaixian{
		background-color: #10C82E;
	}
	.yuandian{
		position: absolute;
		width: 24rpx;
		height: 24rpx;
		border-radius:24rpx;
		background-color: #818181;
		right: 0;
		bottom: 4rpx;
		
	}
	.pingding{
		height:40rpx;
		font-size:28rpx;
		font-weight:400;
		color:rgba(51,51,51,1);
		line-height:40rpx;
		padding-right: 30rpx;
	}
	.touxiang{
		width: 92rpx;
		height: 92rpx;
		border-radius:50rpx;overflow: hidden;
		
	}
	.touxiang image{
		width: 100%;
		height: 100%;
	}
	.user-name{
		height:44rpx;
		font-size:32rpx;
		font-weight:500;
		color:rgba(25,25,25,1);
		line-height:44rpx;
		padding-right: 8rpx;
	}
	.renzhengtu{
		width: 26rpx;
		height: 32rpx;
		margin-top: 6rpx;
	}
	.biaoqian{
		height:34rpx;
		font-size:24rpx;
		font-weight:400;
		color:$uni-color-primary;
		line-height:34rpx;
		border: 1rpx solid $uni-color-primary;
		border-radius: 4rpx;
		padding: 2rpx 8rpx 0 8rpx;
		margin-right: 8rpx;
	}
	.neirong{
		flex: 1;
	}
	.oneTui{
		background-color: #FFFFFF;
		padding: 30rpx 0 32rpx 30rpx;
		border-bottom: 1rpx solid #EEEEEE;
	}
</style>

